<template>
  <div class="home-header">
    <!-- 时间天气 -->
    <div class="header-time">
      <span>{{getTiem}}</span>
      <span>多云</span>
    </div>
    <div class="header-logo">
      <h2>LOGO</h2>
    </div>
  </div>
</template>

<script>
export default {
  name:'home-header',
  data(){
    return {
      getTiem:'',
    }
  },
  // 页面加载显示
  created(){
    setInterval(this.getTime,100)
  },
  methods:{
    getTime(){
      var time=new Date();
      this.getTiem=time.toLocaleString()
    }
  }
}
</script>

<style lang="less" scoped>
  .home-header{
    height:30px;position:relative;background:#002451;color:#fffb;border-radius:0 0 4px 4px;
    // 时间天气信息333
    .header-time{
      height:100%;line-height:30px;text-align:left;
      span{
        margin:0 20px;
      }
    }
    // logo
    .header-logo{
      width:160px;position:absolute;left:calc(50% - 80px);height:100%;top:0;
      h2{
        line-height:30px;
      }
    }
  }
</style>